函數可以接受零個或多個參數
參數是在函數定義時指定的變量名
實際值在函數調用時傳入
使用return關鍵字指定函數的返回值
如果沒有指定返回值,函數默認返回undefined
return語句會立即結束函數的執行並返回指定的值
//輸入參數##
function add(a, b) {
return a + b; //返回參數
}
函數在js屬於第一類對象(First-class Functions),他有四個主要的特性
// 函數聲明
function greet(name) {
return `Hello, ${name}!`;
}
// 將函數賦值給變量
let sayHello = greet;
console.log(sayHello("Alice")); // 輸出: Hello, Alice!
function operate(x, y, operation) {
return operation(x, y);
}
function add(a, b) {
return a + b;
}
function multiply(a, b) {
return a * b;
}
console.log(operate(5, 3, add)); // 輸出: 8
console.log(operate(5, 3, multiply)); // 輸出: 15
function createMultiplier(factor) {
return function(number) {
return number * factor;
};
}
let double = createMultiplier(2);
let triple = createMultiplier(3);
console.log(double(5)); // 輸出: 10
console.log(triple(5)); // 輸出: 15
let mathOperations = {
add: (a, b) => a + b,
subtract: (a, b) => a - b,
multiply: (a, b) => a * b,
divide: (a, b) => a / b
};
console.log(mathOperations.add(5, 3)); // 輸出: 8
console.log(mathOperations.multiply(4, 2)); // 輸出: 8
除此之外,函數還有兩個值得注意的地方:
函數聲明後會被提升(hoisted),意味著可以在定義之前調用函數。
形成獨立的作用域。
將匿名函數賦值給變量:
let functionName = function(parameter1, parameter2, ...) {
// 函數體
return result; // 可選
};
特點:
不會被提升,必須在定義後才能使用。
可以創建匿名函數。
箭頭函數是js在ES6中引入的一種函數語法。它為JavaScript帶來了更簡潔的語法和更直觀的作用域處理,特別適合用於簡短的函數表達式和回調函數。然而,它們並不是傳統函數的完全替代,在選擇使用時需要考慮具體的使用場景和需求。
///原函數
let functionName = (parameter1, parameter2, ...) => {
// 函數體
return result; // 可選
};
///可以簡寫成這樣
let functionName = (parameter1, parameter2, ...) => expression;
例子:
let multiply = (a, b) => a * b;
console.log(multiply(4, 5)); // 輸出:20
綜上所述,箭頭函數帶來了這些優點:
更簡潔的語法,特別是對於簡單的函數。
詞法作用域的 this,避免了傳統函數中this綁定的問題。
適合用於函數式編程,如 map、reduce、filter 等操作。
注意事項:
箭頭函數沒有自己的 this、arguments、super 或 new.target。
不能用作構造函數。
不適合用作對象方法(除非你明確不需要方法中的 this 指向該對象)。
沒有 prototype 屬性。
let person = {
name: "Alice",
greet() {
console.log(`Hello, my name is ${this.name}`);
}
};
person.greet(); // 輸出:Hello, my name is Alice
在這個例子中,greet就是直接在person對象中定義的方法。
let calculator = {
add(a, b) {
return a + b;
},
subtract(a, b) {
return a - b;
},
multiply(a, b) {
return a * b;
},
divide(a, b) {
return a / b;
}
};
console.log(calculator.add(5, 3)); // 輸出:8
console.log(calculator.subtract(10, 4)); // 輸出:6
console.log(calculator.multiply(2, 6)); // 輸出:12
console.log(calculator.divide(15, 3)); // 輸出:5
let methodName = "sayHello";
let greeter = {
[methodName]() {
console.log("Hello!");
}
};
greeter.sayHello(); // 輸出:Hello!
這就使得我們可以動態地定義方法名。
綜上所述,方法定義帶來了這些優點:
簡潔的語法:比傳統的key: function() {}語法更簡潔。
自動綁定this:方法中的this自動綁定到對象實例。
代碼組織:將相關的方法和數據組織在一起,提高代碼的可讀性和維護性。
封裝:可以實現簡單的對象封裝,將數據和行為綑綁在一起。
不過這種方法定義方式與傳統的對象.方法 =function() {}方式在功能上是完全等價的,主要區別在於語法的簡潔性和代碼的組織方式。
發現函數的部分能講的意外的多,故將函數分為上下半部分,將學習計畫向後延一天